<!--
	作者：1055471363@qq.com
	时间：2017-12-12
	描述：材料更换
-->
<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>材料更换</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<link href="../../css/app.css" />
		<style>
			.mui-bar {
				background-color: #0088BB;
			}
			
			.mui-title {
				color: #FFFFFF
			}
			
			a {
				color: #FFFFFF
			}
		</style>
	</head>

	<body>

		<div id="welding" class="mui-content">
			<header class="mui-bar mui-bar-nav">
				<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
				<h1 class="mui-title">材料更换({{OPID}})</h1>
			</header>
			<div class="mui-content">
				<!--<div class="mui-input-row">-->
				<!--<label>EQP ID：</label>-->
				<!--<input type="text" size="10" class="mui-input-clear" placeholder="扫描设备信息" v-model="eqpId">-->
				<!--<input ref="input" type="text" @keyup="keyup" v-bind:value="eqpId" class="mui-input-clear" placeholder="请扫描设备条码" autofocus="autofocus" v-model="eqpId">-->
				<!--</div>-->
				<ul class="mui-table-view" style="margin-top: 10px;">
					<li class="mui-table-view-cell">
						<h4>设备:<span>{{eqpId}}</span></span></h4>
					</li>
				</ul>
				<div v-html="progressbar"> </div>
				<ul id="list" class="mui-table-view mui-table-view-chevron">

					<div v-for="(todo, index) in todos">
						<template v-if="todo.Type == 'Wire'">
							<li class="mui-table-view-divider">
								铜线&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
								<!--<a href="#" v-on:click="open1">更换</a>-->
								<button type="button" class="mui-btn mui-btn-blue" v-on:click="open1">更换</button>
							</li>
							<li class="mui-table-view-cell">
								<label>批次:</label>{{todo.SeqNo}}
							</li>
							<li class="mui-table-view-cell">
								<label>编号:</label> {{todo.MaterialPartNo}}
							</li>
							<li class="mui-table-view-cell">
								<label>直径:</label>{{todo.Size}}
							</li>
							<li class="mui-table-view-cell">
								<label>失效日期:</label>{{todo.RemainTime}}
							</li>

						</template>
						<template v-if="todo.Type == 'Capillary'">
							<li class="mui-table-view-divider">
								劈刀&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
								<!--<a href="#" v-on:click="open2">更换</a>-->
								<button type="button" class="mui-btn mui-btn-blue" v-on:click="open2">更换</button>
							</li>
							<li class="mui-table-view-cell">
								<label>料号:</label>{{todo.SeqNo}}
							</li>
							<li class="mui-table-view-cell">
								<label>序列号:</label>{{todo.MaterialPartNo}}
							</li>
						</template>
						<template v-if="todo.Type== 'Wafer'">
							<li class="mui-table-view-divider">
								晶圆&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
								<!--<a href="#" v-on:click="open3">更换</a>-->
								<button type="button" class="mui-btn mui-btn-blue" v-on:click="open3">更换</button>
							</li>
							<li class="mui-table-view-cell">
								Device:<span>{{todo.Device}}</span>
							</li>
							<li class="mui-table-view-cell">
								WaferSource:<span>{{todo.WaferSource}}</span>
							</li>
							<li class="mui-table-view-cell">
								焊接图:<span>{{todo.Diagram}}</span>
							</li>
							<li class="mui-table-view-cell">
								批次号:<span>{{todo.MaterialPartNo}}</span>
							</li>
						</template>
						<template v-if="todo.Type == 'Expoxy'">
							<li class="mui-table-view-divider">
								银浆&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
								<!--<a href="#" v-on:click="open4">更换</a>-->
								<button type="button" class="mui-btn mui-btn-blue" v-on:click="open4">更换</button>
							</li>
							<li class="mui-table-view-cell">
								物料编码:<span>{{todo.MaterialPartNo}}</span>
							</li>
							<li class="mui-table-view-cell">
								解冻完成:<span>{{todo.ThawEndTime}}</span>
							</li>
						</template>

						<template v-if="todo.Type== 'HubBlade'">
							<li class="mui-table-view-divider">
								晶圆刀片&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
								<!--<a href="#" v-on:click="open5">更换</a>-->
								<button type="button" class="mui-btn mui-btn-blue" v-on:click="open5">更换</button>
							</li>
							<li class="mui-table-view-cell">
								型号:<span>{{todo.MaterialPartNo}}</span>
							</li>
							<li class="mui-table-view-cell">
								刀刃长度:<span>{{todo.SawLength}}</span>
							</li>
							<li class="mui-table-view-cell">
								刀刃厚度:<span>{{todo.SawThickness}}</span>
							</li>
							<li class="mui-table-view-cell">
								刀批次号:<span>{{todo.SeqNo}}</span>
							</li>
						</template>
						<template v-if="todo.Type == 'HublessBlade'">
							<li class="mui-table-view-divider">
								芯片刀片&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
								<!--<a href="#" v-on:click="open6">更换</a>-->
								<button type="button" class="mui-btn mui-btn-blue" v-on:click="open6">更换</button>
							</li>
							<li class="mui-table-view-cell">
								批次号:<span>{{todo.SeqNo}}</span>
							</li>
							<li class="mui-table-view-cell">
								外径:<span>{{todo.ExternalDiameter}}</span>
							</li>
							<li class="mui-table-view-cell">
								内径:<span>{{todo.InternalDiameter}}</span>
							</li>
							<li class="mui-table-view-cell">
								厚度:<span>{{todo.SawThickness}}</span>
							</li>
							<li class="mui-table-view-cell">
								型号:<span>{{todo.ID}}</span>
							</li>

						</template>
					</div>
				</ul>
			</div>
		</div>
	</body>

</html>

<script type="text/javascript" src="../../base.js"></script>
<script src="../../js/mui.min.js"></script>
<script src="../../js/vue.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
	mui.init({
		swipeBack: true //启用右滑关闭功能
	})

	//document.getElementById("cgMetarial-Wire").href= "cgMetarial.html?Type=Wire&EqpId="+value;
	//document.getElementById("cgMetarial-Capillary").href= "cgMetarial.html?Type=Capillary&EqpId="+value;
	var localEqp = localStorage.getItem("localEqp");

	var vm = new Vue({
		el: '#welding',
		data: {
			eqpId: "",
			OPID: localStorage.user,
			todos: [],
			Wire: "#",
			Capillary: "#",
			Wafer: "#",
			Expoxy: "#",
			HubBlade: "#",
			HublessBlade: "#",
			progressbar: ""
		},
		mounted: function() {
			var _this = this;
			_this.eqpId = localEqp;
			this.matReplace()
		},
		methods: {
			matReplace: function() {
				var _this = this;
				//					localStorage.eqpId = e.target.value
				//					_this.eqpId = e.target.value
				_this.Wire = "cgMetarial.html?Type=Wire&EqpId=" + localEqp
				_this.Capillary = "cgMetarial.html?Type=Capillary&EqpId=" + localEqp
				_this.Wafer = "cgMetarial.html?Type=Wafer&EqpId=" + localEqp
				_this.Expoxy = "cgMetarial.html?Type=Expoxy&EqpId=" + localEqp
				_this.HubBlade = "cgMetarial.html?Type=HubBlade&EqpId=" + localEqp
				_this.HublessBlade = "cgMetarial.html?Type=HublessBlade&EqpId=" + localEqp
				//				mui.ajax(url + "&EqpId=" + e.target.value, {
				mui.ajax(base + '/ShowMeterial/index?EqpId=' + localEqp, {
					dataType: 'json',
					timeout: 120000,
					data: {
						_time_: Math.random()
					},
					success: function(a) {
						//震动
						navigator.vibrate = navigator.vibrate ||
							navigator.webkitVibrate ||
							navigator.mozVibrate ||
							navigator.msVibrate;
						if(a != null && a.Materials != '') {
							var mm = a.Materials.MesMaterial;
							if(mm instanceof Array) {
								_this.todos = mm;
							} else {
								_this.todos = [];
								_this.todos.push(mm);
							}
							_this.eqpId = localEqp

						} else {
							mui.alert("此设备上没有物料，请请联系相关人员设置BOM")
							navigator.vibrate([400, 300, 200, 100]);
						}

						_this.progressbar = ""
					},
					error: function(xhr, type, errorThrown) {
						mui.toast("网络异常");
					}
				})
			},
			open1: function() {
				var _this = this;
				var win = window.open(_this.Wire);
			},
			open2: function() {
				var _this = this;
				var win = window.open(_this.Capillary);
			},
			open3: function() {
				var _this = this;
				var win = window.open(_this.Wafer);
			},
			open4: function() {
				var _this = this;
				var win = window.open(_this.Expoxy);
			},
			open5: function() {
				var _this = this;
				var win = window.open(_this.HubBlade);
			},
			open6: function() {
				var _this = this;
				var win = window.open(_this.HublessBlade);
			},
			keyup(e) {
				if(e === null || e.keyCode === 13) {

					var _this = this;

					localStorage.eqpId = e.target.value
					_this.Wire = "cgMetarial.html?Type=Wire&EqpId=" + localEqp
					_this.Capillary = "cgMetarial.html?Type=Capillary&EqpId=" + localEqp
					_this.Wafer = "cgMetarial.html?Type=Wafer&EqpId=" + localEqp
					_this.Expoxy = "cgMetarial.html?Type=Expoxy&EqpId=" + localEqp
					_this.HubBlade = "cgMetarial.html?Type=HubBlade&EqpId=" + localEqp
					_this.HublessBlade = "cgMetarial.html?Type=HublessBlade&EqpId=" + localEqp
					var url = base + "/ShowMeterial.json?1=1";
					//					mui.ajax('../../json/new_file.json', {

					mui.ajax(url + "&EqpId=" + e.target.value, {
						dataType: 'json',
						timeout: 120000,
						success: function(a) {
							if(a != null && a.Materials != '') {
								var mm = a.Materials.MesMaterial;
								if(mm instanceof Array) {
									_this.todos = mm;
								} else {
									_this.todos = [];
									_this.todos.push(mm);
								}
								_this.eqpId = a.EqpId
							} else {
								mui.toast("此设备上没有物料,请联系相关人员设置BOM")
							}

							_this.progressbar = ""
							//清空文本
							e.target.value = '';
						},
						error: function(xhr, type, errorThrown) {
							mui.toast("网络异常");
						}
					})
				}
			}
		}
	});

	window.onerror = function(msg, url, line, col, error) {
		vm.progressbar = ""
	}
</script>